﻿@page "/maintable"
@attribute [TabItemOption(Text = "Table")]
<PageTitle>Table</PageTitle>

<div style="height:max-content">


<h1>Table - 简单主表</h1>

<Table TItem="Foo" IsPagination="true" PageItemsSource="PageItemsSource" class="table-demo" LineNoText="序号" ShowFooter="true"
       IsStriped="true" IsBordered="true" ShowSkeleton="true" IsMultipleSelect="true" AllowResizing="true"
       ShowColumnList="true" DoubleClickToEdit="true" ShowFilterHeader="true"
       ShowToolbar="true" ShowSearch="true" ShowExtendButtons="true" FixedExtendButtonsColumn="true" HeaderTextWrap="true"
       IsFixedHeader="true" OnQueryAsync="@OnQueryAsync"
       AutoGenerateColumns="true" EditMode="EditMode.Popup">
    <TableToolbarTemplate>
        <TableToolbarButton TItem="Foo"
                            Color="Color.Primary"
                            Icon="fa-fw fa-solid fa-floppy-disk"
                            Text="下载1"
                            IsAsync OnClickCallback="@DownloadAsync" />
        <TableToolbarButton TItem="Foo" Color="Color.Primary" Icon="fa-fw fa-solid fa-pen-to-square" Text="选择" OnClickCallback="@ShowDialog" />
    </TableToolbarTemplate>
    <TableColumns>
        <TableColumn @bind-Field="@context.Hobby" Items="GetHobbys(context)" />
    </TableColumns>
    <TableFooter>
        <TableFooterCell Text="合计：" colspan="3" Align="@Align" />
        <TableFooterCell Aggregate="@Aggregate" Field="@nameof(Foo.Count)" />
    </TableFooter>
</Table>

<section ignore>
    <Modal @ref="Modal">
        <ModalDialog Title="选择项目" IsCentered="true">
            <BodyTemplate>
                <Table TItem="Foo" IsStriped="true" @bind-SelectedRows="@SelectedRows" ClickToSelect="true"
                       ShowToolbar="true" ShowDefaultButtons="false" IsMultipleSelect="true"
                       OnQueryAsync="@OnQueryProductAsync">
                    <TableColumns>
                        <TableColumn @bind-Field="@context.DateTime" />
                        <TableColumn @bind-Field="@context.Name" />
                        <TableColumn @bind-Field="@context.Count" />
                    </TableColumns>
                </Table>
            </BodyTemplate>
            <FooterTemplate>
                <Button Text="确定" Icon="fa-regular fa-square-check" OnClick="@OnConfirm" />
            </FooterTemplate>
        </ModalDialog>
    </Modal>
</section>
</div>
